@extends('backend.layouts.main')
@section('content')
<link rel="stylesheet"  type="text/css" href="{{URL::asset('backend/css/webupload/webuploader.css')}}">
<script type="text/javascript" src="{{URL::asset('backend/js/webupload/webuploader.js')}}"></script>
<div class="col-md-12">
    <div class="box box-primary">
        <div class="box-header with-border">
            <h3 class="box-title">修改私教</h3>
        </div>
        <form class="form-horizontal" action="{{URL('admin/user/')."/".encryptionUrl($userDatas->id)}}" method="post">
            <div class="box-body">
                {{ method_field('PUT') }}
                {{ csrf_field() }}
                <div class="box-body">
                    <div class="form-group">
                        <label for="inputWarning">用户名</label>
                        <input type="text" class="form-control" name="name" value="{{$userDatas->name}}">
                        @if ($errors->has('name'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('name') }}</strong>
                        </span>
                        @endif
                    </div>

                    <div class="form-group">
                        <label for="inputWarning">头像</label>
                        <div id="fileListTmp" class="uploader-list"><div id="WU_FILE_0" class="file-item thumbnail upload-state-done">
                                <img src="{{$userDatas->images}}" style="width: 150px;height:150px"><div class="info">图片.jpg</div></div>

                        </div>
                        <div id="uploader-demo">
                            <!--用来存放item-->
                            <div id="fileList" class="uploader-list"></div>
                            <div id="filePicker">选择图片</div>
                        </div>

                        @if ($errors->has('images'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('images') }}</strong>
                        </span>
                        @endif
                    </div>
                    <div class="form-group">
                        <label for="inputWarning">用户名</label>
                        <input type="text" class="form-control" οnkeyup="value=value.replace(/[\u4e00-\u9fa5]/ig,'')"  name="username" value="{{ $userDatas->username}}">
                        @if ($errors->has('username'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('username') }}</strong>
                        </span>
                        @endif
                    </div>
                    <div class="form-group">
                        <label for="inputWarning">手机号</label>
                        <input type="text" class="form-control" name="phone" maxlength="11"  value="{{$userDatas->phone}}">
                        @if ($errors->has('phone'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('phone') }}</strong>
                        </span>
                        @endif
                    </div>
                    <div class="form-group">
                        <label for="inputWarning">密码</label>
                        <input type="password" class="form-control" name="password"value="" placeholder="********">
                        @if ($errors->has('password'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('password') }}</strong>
                        </span>
                        @endif
                    </div>

                    <div class="form-group">
                        <label for="inputWarning">教练等级</label>
                        <input type="input" class="form-control" name="level"value="{{$userDatas->level}}" placeholder="初级教练">
                        @if ($errors->has('level'))
                        <span class="help-block">
                            <strong style="color: #a94442;">{{ $errors->first('level') }}</strong>
                        </span>
                        @endif
                    </div>

                    <div class="form-group">
                        <label for="inputWarning">简介</label>
                        <textarea class="form-control" rows="3" name="synopsis"  placeholder="简介......">{{$userDatas->synopsis}}</textarea>
                    </div>
                    <div class="form-group">
                        <div class="radio">
                            <label>
                                <input type="radio" name="status" value="1" @if($userDatas->status == 1)checked @endif>启用
                            </label>
                            <label>
                                <input type="radio" name="status" value="0"  @if($userDatas->status == 0)checked @endif >禁用
                            </label>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <input type="hidden" class="form-control" name="images" value="{{$userDatas->tmpImages}}" id="imagesId" >
                </div>
                <div class="box-footer">
                    <button type="submit" class="btn btn-primary">提交</button>
                </div>
        </form>
    </div>
</div>
</div>
<script>
$(function () {
// 初始化Web Uploader
    var uploader = WebUploader.create({

// 选完文件后，是否自动上传。
        auto: true,
// 文件接收服务端。
        server: '/admin/uploadImage',

// 选择文件的按钮。可选。
// 内部根据当前运行是创建，可能是input元素，也可能是flash.
        pick: '#filePicker',
// 只允许选择图片文件。
        accept: {
            title: 'Images',
            extensions: 'gif,jpg,jpeg,bmp,png',
            mimeTypes: 'image/*'
        }
    });
// 当有文件添加进来的时候
    uploader.on('fileQueued', function (file) {
        var $li = $(
                '<div id="' + file.id + '" class="file-item thumbnail">' +
                '<img>' +
                '<div class="info">' + file.name + '</div>' +
                '</div>'
                ),
                $img = $li.find('img');

        var $list = $("#fileList");
// $list为容器jQuery实例
        $list.append($li);
// 创建缩略图
// 如果为非图片文件，可以不用调用此方法。
// thumbnailWidth x thumbnailHeight 为 100 x 100
        uploader.makeThumb(file, function (error, src) {
            if (error) {
                $img.replaceWith('<span>不能预览</span>');
                return;
            }

            $img.attr('src', src);
        }, 100, 100);
    });
// 文件上传过程中创建进度条实时显示。
    uploader.on('uploadProgress', function (file, percentage) {
        var $li = $('#' + file.id),
                $percent = $li.find('.progress span');

// 避免重复创建
        if (!$percent.length) {
            $percent = $('<p class="progress"><span></span></p>')
                    .appendTo($li)
                    .find('span');
        }

        $percent.css('width', percentage * 100 + '%');
    });

// 文件上传成功，给item添加成功class, 用样式标记上传成功。
    uploader.on('uploadSuccess', function (file, response) {
        if (response.code == 200) {
            $("#fileListTmp").hide();
            $("#imagesId").val(response.path);
            $("#filePicker").hide();
        }
        $('#' + file.id).addClass('upload-state-done');
    });

// 文件上传失败，显示上传出错。
    uploader.on('uploadError', function (file) {
        var $li = $('#' + file.id),
                $error = $li.find('div.error');

// 避免重复创建
        if (!$error.length) {
            $error = $('<div class="error"></div>').appendTo($li);
        }

        $error.text('上传失败');
    });

// 完成上传完了，成功或者失败，先删除进度条。
    uploader.on('uploadComplete', function (file) {
        $('#' + file.id).find('.progress').remove();
    });

})
</script>
@endsection
